import { computed, defineAsyncComponent } from "vue";
import Network from "./components/NetworkTab";
import Resource from "./components/ResourceTab";
import Request from "./components/RequestTab";
import Chain from "./components/ChainTab";
import Flame from "./components/FlameTab";

// const Network = defineAsyncComponent(() => import("./components/NetworkTab/index.vue"))
// const Resource = defineAsyncComponent(() => import('./components/ResourceTab/index.vue'))
// const Request = defineAsyncComponent(() => import('./components/RequestTab/index.vue'))
// const Chain = defineAsyncComponent(() => import('./components/ChainTab/index.vue'))
// const Flame = defineAsyncComponent(() => import('./components/FlameTab/index.vue'))
export default function useTab({ nodeInfo, drawerType }) {
  const baseTabs = [
    {
      key: "net",
      label: "网络数据",
      name: Network,
      path: "./components/NetworkTab",

      // props: {
      //   node: nodeInfo,
      //   queryTime: selectTime,
      //   srcNodes: srcNodes,
      //   type: drawerType,
      // },
    },
    {
      key: "resource",
      label: "资源情况",
      name: Resource,
      path: "./components/ResourceTab",
      // props: {
      //   node: nodeInfo,
      //   queryTime: selectTime,
      //   apiType,
      // },
      events: {},
    },
  ];
  const vmTabs = [
    ...baseTabs,
    {
      key: "request",
      label: "请求分析",
      name: Request,
      path: "./components/RequestTab",
    },
    ...(!nodeInfo?.isHideCallChain
      ? [
          {
            key: "chain",
            label: "调用链",
            name: Chain,
            path: "./components/ChainTab",
          },
        ]
      : []),
  ];
  const podTabs = [
    ...baseTabs,
    // {
    //   key: "log",
    //   label: "日志记录",
    //   children: (
    //     <LogRecord
    //       node={nodeInfo}
    //       queryTime={selectTime}
    //       type={drawerType}
    //       hasException={hasException}
    //     />
    //   ),
    // },
    {
      key: "request",
      label: "请求分析",
      name: Request,
      path: "./components/RequestTab",
      // props: {
      //   node: nodeInfo,
      //   queryTime: selectTime,
      //   pageType: "node",
      //   type: drawerType,
      //   url,
      //   srcNodes,
      //   visible,
      // },
      // children: (
      //   <Relation
      //     data={nodeInfo}
      //     queryTime={selectTime}
      //     pageType="node"
      //     type={drawerType}
      //     url={url}
      //     srcNodes={srcNodes}
      //     visible={isOpen}
      //   />
      // ),
      // children: <></>
    },
    {
      key: "flame",
      label: "火焰图",
      name: Flame,
      path: "./components/FlameTab",
      // props: {
      //   node: nodeInfo,
      //   queryTime: selectTime,
      //   pageType: "node",
      //   type: drawerType,
      //   url,
      //   srcNodes,
      //   visible,
      // },
    },
    // {
    //   key: "alarm",
    //   label: workloadInfo.alarmCount ? (
    //     <>
    //       <span style={{ marginRight: 4 }}>告警</span>
    //       <Badge status="error" size="small" count={workloadInfo.alarmCount} />
    //     </>
    //   ) : (
    //     "告警"
    //   ),
    //   children: (
    //     <AlarmList
    //       node={nodeInfo}
    //       queryTime={selectTime}
    //       alarmType={drawerType}
    //       visible={isOpen}
    //     ></AlarmList>
    //   ),
    // },
  ];
  const workloadTabs = [
    ...baseTabs,
    // {
    //   key: "log",
    //   label: "日志记录",
    //   children: (
    //     <LogRecord
    //       node={nodeInfo}
    //       queryTime={selectTime}
    //       type={drawerType}
    //       hasException={hasException}
    //     />
    //   ),
    // },
    {
      key: "request",
      label: "请求分析",
      name: Request,
      path: "./components/RequestTab",
      // props: {
      //   node: nodeInfo,
      //   queryTime: selectTime,
      //   pageType: "node",
      //   type: drawerType,
      //   url,
      //   srcNodes,
      //   visible,
      // },
      // children: (
      //   <Relation
      //     data={nodeInfo}
      //     queryTime={selectTime}
      //     pageType="node"
      //     type={drawerType}
      //     url={url}
      //     srcNodes={srcNodes}
      //     visible={isOpen}
      //   />
      // ),
      // children: <></>
    },
    {
      key: "chain",
      label: "调用链",
      name: Chain,
      path: "./components/ChainTab",
      // props: {
      //   node: nodeInfo,
      //   queryTime: selectTime,
      //   pageType: "node",
      //   type: drawerType,
      //   url,
      //   srcNodes,
      //   visible,
      // },
    },
    {
      key: "flame",
      label: "火焰图",
      name: Flame,
      path: "./components/FlameTab",
      // props: {
      //   node: nodeInfo,
      //   queryTime: selectTime,
      //   pageType: "node",
      //   type: drawerType,
      //   url,
      //   srcNodes,
      //   visible,
      // },
    },
    // {
    //   key: "alarm",
    //   label: workloadInfo.alarmCount ? (
    //     <>
    //       <span style={{ marginRight: 4 }}>告警</span>
    //       <Badge status="error" size="small" count={workloadInfo.alarmCount} />
    //     </>
    //   ) : (
    //     "告警"
    //   ),
    //   children: (
    //     <AlarmList
    //       node={nodeInfo}
    //       queryTime={selectTime}
    //       alarmType={drawerType}
    //       visible={isOpen}
    //     ></AlarmList>
    //   ),
    // },
  ];
  const tabs = computed(() => {
    console.log(nodeInfo.value, "nodeInfo");

    if (nodeInfo.value?.workloadKind === "vm") {
      return vmTabs;
    } else if (drawerType.value === "workload") {
      return workloadTabs;
    } else {
      return podTabs;
    }
  });
  // console.log(baseTabs, 'baseTabs');

  return tabs;
}
